<template>
	<custom-page title="完善资料" borderBottomColor="transparent" backgroundColor="#ffffff">
		<template #content>
			<view class="page-content">
				<view class="pesonal-info-layout">
					<view class="personal-photo-view">
						<custom-choose-media @selectBack="selectImage">
							<template #content>
								<view class="personal-photo-center">
									<image class="personal-photo-img" :src="getAvator(assistantInfo.sculptureUrl)" mode="aspectFill"></image>
									<view class="camera">
										<image :src="asserts.ic_camera"></image>
									</view>
								</view>
							</template>
						</custom-choose-media>
					</view>
				</view>
				<view class="row-item" @click="toEditClick('nick')">
					<view class="title">昵称</view>
					<view class="content">{{assistantInfo.name}}</view>
					<image class="right-img" :src="asserts.ic_arrow_right"></image>
				</view>
				<view class="divider"></view>
				<view class="row-item">
					<view class="title">助教等级</view>
					<view class="content">{{assistantInfo.gradeName}}</view>
					<image class="grade-img" v-if="false"></image>
				</view>
				<view class="row-item" @click="toEditClick('introduce')">
					<view class="title">简介</view>
					<view class="content">{{assistantInfo.introductory || '请输入简介'}}</view>
					<image class="right-img" :src="asserts.ic_arrow_right"></image>
				</view>
				<view class="divider"></view>
				<view class="row-item" @click="toEditClick('sex')">
					<view class="title">性别</view>
					<view class="content">{{assistantInfo.sexDesc || '请选择性别'}}</view>
					<image class="right-img" :src="asserts.ic_arrow_right"></image>
				</view>
				<view class="divider"></view>
				<view class="row-item" @click="toEditClick('birthday')">
					<view class="title">生日</view>
					<view class="content">{{assistantInfo.birthdayTime||'请选择出生年月'}}</view>
					<image class="right-img" :src="asserts.ic_arrow_right"></image>
				</view>
				<view class="divider"></view>
				<view class="row-item" @click="toFileEditClick('tag')">
					<view class="title">标签</view>
					<assistant-computed-info type="tag3" :labelDescList="assistantInfo.labelDescList" v-if="assistantInfo.labelDescList"></assistant-computed-info>
					<view class="content" v-else>请选择标签</view>
					<image class="right-img" :src="asserts.ic_arrow_right"></image>
				</view>
				<view class="divider2"></view>
				
				<view class="row-item" @click="toFileEditClick('image')">
					<view class="title">助教照片</view>
					<view class="content">去上传</view>
					<image class="right-img" :src="asserts.ic_arrow_right"></image>
				</view>
				<view class="divider"></view>
				<view class="row-item" @click="toFileEditClick('video')">
					<view class="title">助教视频</view>
					<view class="content">去上传</view>
					<image class="right-img" :src="asserts.ic_arrow_right"></image>
				</view>
				<view class="divider2"></view>
				
				<view class="row-item" @click="toEditClick('practiceState')">
					<view class="title">执业状态</view>
					<view class="content">{{assistantInfo.practiceStateDesc || '请选择'}}</view>
					<image class="right-img" :src="asserts.ic_arrow_right"></image>
				</view>
				<view class="divider" v-if="assistantInfo.practiceStateCode==5"></view>
				<view class="row-item" v-if="assistantInfo.practiceStateCode==5">
					<view class="title">服务门店</view>
					<view class="content">{{assistantInfo.deptName || '无'}}</view>
				</view>
				<view class="divider"></view>
				<view class="row-item" @click="toEditClick('salesman')">
					<view class="title">所属管理者</view>
					<view class="content">{{assistantInfo.salesmanUserName || '请选择'}}</view>
					<image class="right-img" :src="asserts.ic_arrow_right"></image>
				</view>
				<view class="divider"></view>
				<view class="row-item" @click="toFileEditClick('serviceTime')">
					<view class="title">服务时间</view>
					<view class="content">{{getWorkTime(assistantInfo.businessHoursStart, assistantInfo.businessHoursEnd)}}</view>
					<image class="right-img" :src="asserts.ic_arrow_right"></image>
				</view>
				<view class="divider2"></view>
			</view>
		</template>
		<template #foot>
			<custom-bottom-button text="设置完成，去接单" @confirm="confirmClick"></custom-bottom-button>
		</template>
	</custom-page>
</template>

<script>
	import {
		apis
	} from '../../global/config.js'
	import { getTimeMills } from '../../utils/utils'
	export default {
		data() {
			return {
				assistantInfo: {},
				type: '',
			}
		},
		computed: {
			getAvator(){
				return (avator) => {
					if(avator){
						return avator
					}else{
						return this.asserts.ic_avatar_default
					}
				}
			},
			getWorkTime(){
				return (start, end) => {
					if(start && end){
						return `${start}-${end}`
					}else{
						return '点击设置'
					}
				}
			}
		},
		onLoad(val) {
			//是否是从实名认证跳转
			this.type = val.type
			this.getAssistantDetailToken()
		},
		methods: {
			//助教详情
			getAssistantDetailToken(){
				this.requestCenter.getAssistantDetailToken().then(res => {
					this.assistantInfo = res
				})
			},
			
			//图片选择
			selectImage(data){
				let avatarUrl = data.data
				let uploadParams = {
					operateType: 1,		//oss操作类型枚举 1-用户 2-商品 3-展现	
					ossStorageType: 1,		//oss存储类型枚举 1-图片 2-文本 3-视频	
				}
				// #ifdef H5 || APP-PLUS
				uni.showLoading({
					title:'加载中'
				})
				uni.uploadFile({
					url: apis.uploadFile, //上传文件接口地址
					filePath: avatarUrl,
					formData: uploadParams,
					name: 'file',
					success: (uploadFileRes) => {
						uni.hideLoading()
						if(uploadFileRes.statusCode == '200'){
							let uploadFileResFor = JSON.parse(uploadFileRes.data)
							this.assistantInfo.sculptureUrl = uploadFileResFor.data.fileUrl
							this.assistantInfo.birthdayTime = getTimeMills(this.assistantInfo.birthdayTime)
							this.requestCenter.updateAssistantDetail(this.assistantInfo).then(res => {
								this.getAssistantDetailToken()
							})
						}
					}
				});
				// #endif
				// #ifdef MP
				this.requestCenter.uploadFile(avatarUrl, uploadParams).then(upload => {
					if (upload) {
						this.assistantInfo.sculptureUrl = upload.fileUrl
						this.assistantInfo.birthdayTime = getTimeMills(this.assistantInfo.birthdayTime)
						this.requestCenter.updateAssistantDetail(this.assistantInfo).then(res => {
							this.getAssistantDetailToken()
						})
					}
				})
				// #endif
			},
			
			//点击编辑信息
			toEditClick(type){
				uni.navigateTo({
					url: `/pages/assistant-personal-info-edit/assistant-personal-info-edit?type=${type}&userType=2`,
					events: {
						personalEdit: (data)=> {
							this.getAssistantDetailToken()
						}
					}
				})
			},
			
			//标签、视频、图片编辑
			toFileEditClick(type){
				uni.navigateTo({
					url: '/pages/assistant-personal-file-edit/assistant-personal-file-edit?type=' + type,
					events: {
						personalEdit: (data)=> {
							this.getAssistantDetailToken()
						}
					}
				})
			},
			
			//点击确定
			confirmClick(){
				if(!this.assistantInfo.sculptureUrl){
					uni.showToast({
						title: '请上传头像'
					})
					return
				}
				if(this.assistantInfo.sex == null){
					uni.showToast({
						title: '请选择性别'
					})
					return
				}
				if(!this.assistantInfo.birthdayTime){
					uni.showToast({
						title: '请选择出生年月'
					})
					return
				}
				if(!this.assistantInfo.businessHoursStart || !this.assistantInfo.businessHoursEnd){
					uni.showToast({
						title: '请设置服务时间'
					})
					return
				}
				if(this.type == 'certification'){		//用户实名认证后完善信息
					uni.reLaunch({
						url: '/pages/index/index'
					})
				}else{		//个人中心用户信息修改
					uni.reLaunch({
						url: '/pages/index/index'
					})
				}
			},
			
			
		}
	}
</script>

<style scoped lang="less">
	.page-content{
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
	}
	.pesonal-info-layout{
		display: flex;
		flex-direction: column;
		background-color: white;
	}
	.personal-photo-view{
		width: 100%;
		padding: 64rpx 0rpx;
		box-sizing: border-box;
		display: flex;
		flex-direction: row;
		justify-content: center;
		.personal-photo-center{
			width: 200rpx;
			height: 200rpx;
			position: relative;
			.personal-photo-img{
				width: 200rpx;
				height: 200rpx;
				border-radius: 50%;
			}
			.camera{
				position: absolute;
				width: 64rpx;
				height: 64rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				border-radius: 50%;
				bottom: 10rpx;
				right: -6rpx;
				background-color: #021624;
				image{
					width: 32rpx;
					height: 32rpx;
				}
			}
		}
	}
	.row-item{
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding: 30rpx 32rpx;
		box-sizing: border-box;
		background-color: white;
		.title{
			flex: 1;
			min-width: 100rpx;
			font-size: 28rpx;
			color: #585F70;
			line-height: 48rpx;
		}
		.content{
			font-size: 28rpx;
			color: #021624;
			line-height: 48rpx;
			margin-left: 30rpx;
			margin-right: 22rpx;
		}
		.right-img{
			width: 20rpx;
			height: 24rpx;
		}
		.grade-img{
			width: 136rpx;
			height: 48rpx;
			background-color: aqua;
		}
	}
	.divider{
		width: calc(100% - 64rpx);
		margin: 0 32rpx;
		height: 0.5rpx;
		background-color: #F5F5F5;
	}
	.divider2{
		width: 100%;
		height: 16rpx;
		background-color: #F9F9FB;
	}
</style>
